//导入Vue构造函数
import Vue from "vue";
//导入Router 构造函数
import Router from "vue-router";
//导出8个动态路由规则对象模块
import approvalsRouter from "./modules/approvals";
import attendancesRouter from "./modules/attendances";
import departmentsRouter from "./modules/departments";
import employeesRouter from "./modules/employees";
import salarysRouter from "./modules/salarys";
import permissionsRouter from "./modules/permissions";
import settingsRouter from "./modules/settings";
import social_securitys from "./modules/social_securitys";

//动态路由表数组(需要权限控制)
//可以更改路由的顺序
// export导出这个路由表让permisions拿到
export const anyncRoutes = [
  departmentsRouter,
  settingsRouter,
  employeesRouter,
  permissionsRouter,
  approvalsRouter,
  attendancesRouter,
  salarysRouter,
  social_securitys,
];

// 注册路由插件
Vue.use(Router);

/* 导入Layout架子（基础结构） */
import Layout from "@/layout";

// 静态路由表 (所有角色都可访问的路由)
export const constantRoutes = [
  //这是登录页面login路由
  {
    path: "/login",
    component: () => import("@/views/login/index"),
    // hidden: true表示当前路由隐藏不会出现在主页的左侧菜单
    hidden: true, //就是隐藏了该路由不在左侧菜单，但是原先需要进行访问也能访问到
  },
  //这是登录没有的页面会跳转到404
  {
    path: "/404",
    component: () => import("@/views/404"),
    hidden: true,
  },
  // 一级路由，二级路由在children中写，三级路由在children中继续进行嵌套
  {
    path: "/",
    component: Layout,
    redirect: "/dashboard",
    children: [
      {
        path: "dashboard", //这是自定义路由名字
        name: "dashboard", // 路由的名称
        component: () => import("@/views/dashboard/index"),
        meta: { title: "首页", icon: "dashboard" }, //这是控制左侧的图标和名字
      },
      // //审批
      // {
      //   path: "approvals",
      //   name: "approvals", // 路由的名称
      //   // name属性必须添加，后续需要基于name属性去userInfo.roles,menus中比对(使用与动态路由做筛选)
      //   // name的取值必须和userInfo.rolesmenps中的值保持一致（动态路由筛选的标志）
      //   component: () => import("@/views/approvals/index"),
      //   meta: { title: "审批", icon: "dashboard" }, //这是控制左侧的图标和名字
      // },
    ],
  },
  // 我们希望这个404永远放在最后
  // 没有匹配到的页面, 走404 // 404页必须放在末尾！！！
  // { path: "*", redirect: "/404", hidden: true },
];
// todo：动态路由表（需要通过权限控制的路由）
// 创建路由实例，把 new VueRouter()写在了函数中
const createRouter = () =>
  new Router({
    // 路由模式，默认是hash模式，可选值还有history历史模式
    // mode: 'history'
    // 当路由切换的时候，让页面回到最顶部
    scrollBehavior: () => ({ y: 0 }),
    // 临时让静态路由表和动态路由表合并（就是当前用户可以看到所有的菜单）
    // ...展开的意思，要想不同用户展示不同的内容要进行控制动态路由表
    // routes: [...constantRoutes, ...anyncRoutes],anyncRoutes这是个动态 // 临时合并动态路由和静态路由
    // 写死的我们只开放静态路由表（constantRoutes）
    routes: constantRoutes,
  });
//调用创建路由实例函数，接收路由实例
const router = createRouter();
//重置路由函数
export function resetRouter() {
  const newRouter = createRouter();
  router.matcher = newRouter.matcher; // reset router
}
// 导出router实例，提供其他js模块使用
export default router;
